

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>商品管理</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" href="/admin/layuiadmin/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="/admin/layuiadmin/style/admin.css" media="all">
  <style>
    @font-face {
      font-family: 'iconfont';  /* Project id 2565954 */
      src: url('https://at.alicdn.com/t/font_2565954_q2snf28joy.woff2?t=1621766073287') format('woff2'),
      url('https://at.alicdn.com/t/font_2565954_q2snf28joy.woff?t=1621766073287') format('woff'),
      url('https://at.alicdn.com/t/font_2565954_q2snf28joy.ttf?t=1621766073287') format('truetype');
    }
    .iconfont{
      font-family:"iconfont" !important;
      font-size:16px;font-style:normal;
      -webkit-font-smoothing: antialiased;
      -webkit-text-stroke-width: 0.2px;
      -moz-osx-font-smoothing: grayscale;}
    .layui-layer-admin .layui-layer-ico {
      background: url("/admin/layuiadmin/gb.png") no-repeat!important;
      background-size:16px 16px!important;
      /*background-position: 0px -40px!important;*/
    }
    </style>
</head>
<body>

  <div class="layui-fluid">   
    <div class="layui-card">
      <div class="layui-form layui-card-header layuiadmin-card-header-auto">
        <div class="layui-form-item">
          <div class="layui-inline">
            <label class="layui-form-label">预约ID</label>
            <div class="layui-input-block">
              <input type="text" name="id" placeholder="请输入" autocomplete="off" class="layui-input">
            </div>
          </div>
          
          <div class="layui-inline">
            <label class="layui-form-label">用户id</label>
            <div class="layui-input-block">
              <input type="text" name="uid" placeholder="请输入" autocomplete="off" class="layui-input">
            </div>
          </div>
          <div class="layui-inline">
            <label class="layui-form-label">预约姓名</label>
            <div class="layui-input-block">
              <input type="text" name="namex" placeholder="请输入" autocomplete="off" class="layui-input">
            </div>
          </div>
          <!-- <div class="layui-inline">
            <label class="layui-form-label">预约手机号</label>
            <div class="layui-input-block">
              <input type="text" name="mobile" placeholder="请输入" autocomplete="off" class="layui-input">
            </div>
          </div>
          
          <div class="layui-inline">
            <label class="layui-form-label">预约身份证号</label>
            <div class="layui-input-block">
              <input type="text" name="cardno" placeholder="请输入" autocomplete="off" class="layui-input">
            </div>
          </div> -->
          
          <div class="layui-inline">
            <label class="layui-form-label">状态</label>
            <div class="layui-input-block">
              <select name="status">
                <option value="0">请选择</option>
                <option value="1">预约成功</option>
                <option value="2">叫号</option>
                <option value="3">已过号</option>
                <option value="4">开始办理</option>
                <option value="5">取消预约</option>
                <option value="6">办理成功</option>
              </select>
            </div>
          </div>

          <div class="layui-inline">
            <label class="layui-form-label">开始时间</label>
            <div class="layui-input-block">
                <input type="text" name="str" placeholder="请输入" id="time2" autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-inline">
            <label class="layui-form-label">结束时间</label>
            <div class="layui-input-block">
                <input type="text" name="end" placeholder="请输入" id="time3" autocomplete="off" class="layui-input">
            </div>
        </div>

          <div class="layui-inline">
            <button class="layui-btn layuiadmin-btn-useradmin" lay-submit lay-filter="LAY-user-front-search">
              <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
            </button>
          </div>
        </div>
      </div>
      <div class="layui-card-body">
        <div style="padding-bottom: 10px;display:flex;flex-direction:row;justify-content: space-between;">
        
            <div>
                  {in name="$data.del" value="$permis"}
                  <button class="layui-btn layuiadmin-btn-useradmin" data-type="del">删除</button>
                  {/in}
            </div>
          
          
          <div></div>
          
          
        </div>
        <table class="layui-table" lay-data="{ url:'/admin/Call/orderlist',method:'post', page:true, id:'LAY-user-managet'}" lay-filter="LAY-user-managet">
          <thead>
          <tr>
            <th lay-data="{type: 'checkbox', fixed: 'left'}"></th>
            <th lay-data="{field:'id', width:120, sort: true}">ID</th>
            <th lay-data="{field:'tit1'}">预约项目</th>
            <th lay-data="{field:'guitai'}">柜台</th>
            <th lay-data="{templet:'#name'}">姓名</th>
            <th lay-data="{field:'which'}">多少号</th>
            <th lay-data="{templet:'#time'}">预约 / 叫号 / 过号 / 时间</th>
            <th lay-data="{field:'status',templet:'#status'}">状态</th>
            <th lay-data="{fixed: 'right', width:420, align:'center', toolbar: '#barDemo'}">操作</th>
          </tr>
          </thead>
        </table>
        <script type="text/html" id="name">
          {{d.name?d.name:'无'}}
        </script>
        <script type="text/html" id="which">
          <span style="font-size:14px;font-weight:bold">{{d.which}}</span>
          {{# if(d.isvip==1){ }}
            <span style="color: #FF5722;">-vip</span>
          {{# } }}
        </script>
        <script type="text/html" id="shop_money">
          {{d.no}} / {{d.yuyue_zno==0?'不限':d.yuyue_zno}}
        </script>
        <script type="text/html" id="yuyue">
          <span lay-event="addressdz" style="color: #3B91FF;cursor:pointer" title="查看完整的预约信息">
            {{# if(d.name){ }}
            {{d.name}}
            {{# }else{ }}
            无
            {{# } }}
            {{# if(d.phone){ }}
            {{d.phone}}
            {{# }else{ }}
            无
            {{# } }}
            <i class="layui-icon layui-icon-search"></i>
          </span>
        </script>
        <script type="text/html" id="user">
          <span style="color: #FF6A00;cursor:pointer" lay-href="/admin/User/userinfo?id={{d.uid}}" title="买家信息">
            {{d.nick}}
            <i class="layui-icon layui-icon-search"></i>
          </span>
        </script>
        <script type="text/html" id="time">
                <span  lay-event="hao_time">
                {{d.addtime}}
                <i class="layui-icon layui-icon-search" style="cursor:pointer"></i>
              </span>
          </script>
       
        <script type="text/html" id="status">
          {{# if(d.status==1){ }}
          <span style="color: #17D783;">预约成功</span>
          
          {{# }else if(d.status==2){ }}
          <span style="color: #17D783;">正在叫号</span>
          
          {{# }else if(d.status==3){ }}
          <span style="color: #FF6A00;">已过号</span>
          
          {{# }else if(d.status==4){ }}
          <span style="color: #17D783;">待审核</span>
          
          {{# }else if(d.status==5){ }}
          <span style="color: #FF6A00;">取消预约</span>
          {{# }else if(d.status==6){ }}
          <span style="color: #17D783;">办理完成</span>
          
          {{# }else{ }}
          其他
          {{# } }}
        </script>
        <script type="text/html" id="mobile">
          {{# if(d.mobile){ }}
          {{d.mobile}}
          {{# }else{ }}
          未绑定
          {{# } }}
        </script>
          <script type="text/html" id="img">
              <span lay-href="/admin/Yuyue/yuyuelist?id={{d.list_id}}" style="color: #FF6A00;cursor:pointer;margin-left: 4px;" title="预约信息">
                {{d.title}}
                <i class="layui-icon layui-icon-search"></i>
              </span>
          </script>
        <script type="text/html" id="barDemo">
            {in name="$data.jiaohao" value="$permis"}
                {{# if(d.status==1){ }}
                <a class="layui-btn layui-bg-orange layui-btn-xs" lay-event="jiaohao"><i class="layui-icon layui-icon-notice"></i>叫号</a>
                {{# } }}
                {{# if(d.status==2){ }}
            <a class="layui-btn layui-bg-orange layui-btn-xs" lay-event="jiaohao"><i class="layui-icon layui-icon-notice"></i>重呼</a>
                <a class="layui-btn layui-bg-green layui-btn-xs" lay-event="jiaohaogong"><i class="layui-icon layui-icon-praise"></i>已服务</a>
                {{# } }}
            {/in}

            {in name="$data.guohao" value="$permis"}
                {{# if(d.status==2){ }}
                <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="guohao"><i class="layui-icon layui-icon-tread"></i>过号</a>
                {{# } }}
                {{# if(d.status==3){ }}
                <a class="layui-btn layui-bg-orange layui-btn-xs" lay-event="jiaohao"><i class="layui-icon layui-icon-notice"></i>重呼</a>
                {{# } }}
            {/in}


            {in name="$data.info" value="$permis"}
            <a class="layui-btn layui-btn-normal layui-btn-xs" lay-href="/admin/Call/order_info?id={{d.id}}" lay-text="订单详情"><i class="layui-icon layui-icon-search"></i>详情</a>
            {/in}
          {in name="$data.del" value="$permis"}
          <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
          {/in}
        </script>
      </div>

      <div id='playerBox' style='height:0;width:0;' data-title="播放器"></div>


    </div>
  </div>

 <script src="/admin/layuiadmin/layui/layui.js"></script>
 <script src="/admin/js/public.js?id=1"></script>
  <script>
  layui.config({
    base: '/admin/layuiadmin/' //静态资源所在路径
  }).extend({
    index: 'lib/index' //主入口模块
  }).use(['index', 'useradmin', 'table','laydate'], function(){
    var $ = layui.$
    ,form = layui.form
    ,laydate = layui.laydate
    ,table = layui.table;

    //执行一个laydate实例
    laydate.render({
        elem: '#time2' //指定元素
        ,type: 'datetime'
    });

    //执行一个laydate实例
    laydate.render({
        elem: '#time3' //指定元素
        ,type: 'datetime'
    });


    form.on('submit(order-daochu)', function(data){
			var field = data.field;
			var par=toQueryString(field);
			window.location.href='/admin/Call/orderlist?dao=1&'+par;
		});

    window.webmsg=function () {
        var serviceip="{:config('-speechsite.app_serviceip')}";
        if(serviceip){
          //var serviceip='ws://127.0.0.1:1236';
          var ws = new WebSocket(serviceip);
          //申请一个WebSocket对象，参数是服务端地址，同http协议使用http://开头一样，WebSocket协议的url使用ws://开头，另外安全的WebSocket协议使用wss://开头
          ws.onopen = function(){
              //当WebSocket创建成功时，触发onopen事件
              console.log("open");
              //每30秒发送一次心跳
              ws.timer=setInterval(function(){
                  ws.send(JSON.stringify({'type':"peng"}));
                  console.log('发送心跳...');
              },30000)
          }
          ws.onmessage = function(e){
              //当客户端收到服务端发来的消息时，触发onmessage事件，参数e.data包含server传递过来的数据
              console.log(e.data);
              var data=e.data;
              var json = eval('(' + data + ')');
              var otherid = json.otherid;
              var which = json.which;
              var status = json.status;
              //如果status=0或status=5那么刷新当前页面
              if(json.type=='message' && (json.status==0 || json.status==5)){ //有新的记录了 或者用户取消了叫号
                  //执行重载
                  table.reload('LAY-user-managet', {
                      where: {}
                  });
              }
          }
          ws.onclose = function(e){
              //当客户端收到服务端发送的关闭连接请求时，触发onclose事件
              console.log("close");
          }
          ws.onerror = function(e){
              //如果出现连接、处理、接收、发送数据失败的时候触发onerror事件
              console.log(error);
          }
        }
    }
    webmsg();//启动

    //搜索角色
    form.on('submit(LAY-user-front-search)', function(data){
        var field = data.field;
        var name=field.name;
        var id=field.id;
        var uid=field.uid;
        var nick=field.nick;
        var namex=field.namex;
        var mobile=field.mobile;
        var cardno=field.cardno;
        var status=field.status;
        var list_id=field.list_id;
        var bankid=field.bankid;

        $.get('/admin/Call/orderlist?name='+name+'&id='+id+'&uid='+uid+'&nick='+nick+'&mobile='+mobile+'&namex='+namex+'&cardno='+cardno+'&status='+status+'&list_id='+list_id+'&bankid='+bankid, function(res){

        });
        //执行重载
        table.reload('LAY-user-managet', {
            where: field
        });
    });

      //监听工具条
      table.on('tool(LAY-user-managet)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
          var data = obj.data; //获得当前行数据
          var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
          var tr = obj.tr; //获得当前行 tr 的DOM对象
          if(layEvent==='hao_time'){
              var addtime=data['addtime'];
              var start_time=data['start_time'];
              var end_time=data['end_time'];
              var gong_time=data['gong_time'];
              if(!start_time){
                  start_time='无';
              }
              if(!end_time){
                  end_time='无';
              }
              if(!gong_time){
                  gong_time='无';
              }
              layer.open({
                  title:'预约信息',
                  type: 1,
                  skin: 'layui-layer-admin',
                  closeBtn: true,
                  area: '350px',
                  anim: 5,
                  shadeClose: true,
                  content: "<div style='padding:20px;'>预约时间："+addtime+"<br/>叫号时间："+start_time+"<br/>过号时间："+end_time+""+"<br/>叫号成功时间："+gong_time+"" +
                  "</div>"
              });
          }else
          if(layEvent === 'addressdz'){ //弹框地址
              var name=data['name'];
              var mobile=data['mobile'];
              var city=data['cartno'];
              if(!name){
                  name='无';
              }
              if(!mobile){
                  mobile='无';
              }
              if(!city){
                  city='无';
              }
              layer.open({
                  title:'预约信息',
                  type: 1,
                  skin: 'layui-layer-admin',
                  closeBtn: true,
                  area: '350px',
                  anim: 5,
                  shadeClose: true,
                  content: "<div style='padding:20px;'>姓名："+name+"<br/>手机号："+mobile+"<br/>身份证号："+city+"" +
                  "</div>"
              });
          }else
          if(layEvent === 'del'){ //删除
              layer.confirm('真的删除当前订单吗', function(index){
                  obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                  layer.close(index);
                  var dataid=data['id'];
                  //向服务端发送删除指令
                  $.post(
                      "{:url('admin/Call/delorder')}",
                      {"id":dataid},
                      function(data,state){
                          if(state != "success"){
                              layer.msg("请求出错!");
                          }else if(data.status == 1){
                              table.reload('LAY-user-managet');
                              layer.msg('已删除');
                          }else{
                              layer.msg(data.msg);
                          }
                      }
                  );
              });
          } else if(layEvent === 'jiaohao'){ //编辑
              var dataid=data['id'];
              var no=data['which'];
              bofang('请'+no+'号前往办理业务');
              //return false;
              //向服务端发送删除指令
              $.post(
                  "{:url('admin/Call/jiaohao')}",
                  {"id":dataid},
                  function(data,state){
                      if(state != "success"){
                          layer.msg("请求出错!");
                      }else if(data.status == 1){
                          table.reload('LAY-user-managet');
                          layer.msg(data.msg);
                      }else{
                          layer.msg(data.msg);
                      }
                  }
              );
          }
          else if(layEvent === 'jiaohaogong'){ //编辑
              var dataid=data['id'];
              var no=data['which'];
              //bofang('请'+no+'号前往办理业务');
              //向服务端发送删除指令
              $.post(
                  "{:url('admin/Call/jiaohaogong')}",
                  {"id":dataid},
                  function(data,state){
                      if(state != "success"){
                          layer.msg("请求出错!");
                      }else if(data.status == 1){
                          table.reload('LAY-user-managet');
                          layer.msg(data.msg);
                      }else{
                          layer.msg(data.msg);
                      }
                  }
              );
          }
          else if(layEvent === 'guohao'){ //编辑
              var dataid=data['id'];
              //向服务端发送删除指令
              $.post(
                  "{:url('admin/Call/guohao')}",
                  {"id":dataid},
                  function(data,state){
                      if(state != "success"){
                          layer.msg("请求出错!");
                      }else if(data.status == 1){
                          table.reload('LAY-user-managet');
                          layer.msg(data.msg);
                      }else{
                          layer.msg(data.msg);
                      }
                  }
              );
          }
      });

    //事件
    var active = {
      del: function(){
          var checkStatus = table.checkStatus('LAY-user-managet')
              ,checkData = checkStatus.data; //得到选中的数据
          if(checkData.length === 0){
              return layer.msg('请选择数据');
          }
          var dataid='';
          for(var i=0;i<checkData.length;i++){
              dataid=dataid+','+checkData[i]['id'];
          }
          layer.confirm('确定删除选中数据吗？', function(index) {
              $.post(
                  "{:url('/admin/Call/delorder')}",
                  {"id":dataid},
                  function(data,state){
                      if(state != "success"){
                          layer.msg("请求出错!");
                      }else if(data.status == 1){
                          table.reload('LAY-user-managet');
                          layer.msg('已删除');
                      }else{
                          layer.msg(data.msg);
                      }
                  }
              );
          });
          //
      }
    }  
    $('.layui-btn.layuiadmin-btn-useradmin').on('click', function(){
      var type = $(this).data('type');
      active[type] ? active[type].call(this) : '';
    });
  });

  function bofang(tit) {
    console.log(tit);
    var textToSpeak = tit;
    var voiceObj = new SpeechSynthesisUtterance(textToSpeak);
    voiceObj.lang = "zh-CN";
    window.speechSynthesis.speak(voiceObj);
  }
  //播放提示音0
  function createPlayer(fid){
      var _id = Math.floor(Math.random() * 800 + 100);
      var audio = document.createElement('audio');
      audio.id = _id;
      audio.src = '/music/'+fid+'.wav';
      audio.preload = 'auto';
      audio.onended = function(){
          this.remove();
      }
      audio.onerror = function(){
          this.remove();
      }
      document.getElementById('playerBox').appendChild(audio);//这句一般可以不要
      audio.play();
      return audio;
  }

  </script>
</body>
</html>

